'use strict';

const autoprefixer = require('autoprefixer');
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
const WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin');
const eslintFormatter = require('react-dev-utils/eslintFormatter');
const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
// const getClientEnvironment = require('./env');
const glob = require('glob');

// Webpack uses `publicPath` to determine where the app is being served from.
// In development, we always serve from the root. This makes config easier.
const publicPath = '/';
// `publicUrl` is just like `publicPath`, but we will provide it to our app
// as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
// Omit trailing slash as %PUBLIC_PATH%/xyz looks better than %PUBLIC_PATH%xyz.
const publicUrl = '';
// Get environment variables to inject into our app.
// const env = getClientEnvironment(publicUrl);

// This is the development configuration.
// It is focused on developer experience and fast rebuilds.
// The production configuration is different and lives in a separate file.

// List of vendor libraries to include in vendor js bundle
// const vendorLibs = require('./vendorLibs');
import {readFile} from './rf';


var webpackConfig = {
    mode : 'development',
    entry: readFile('DevConfigs'),
    output: {
        path: "/", // NO real path is required, just pass "/"
        filename: '[name].js',
        publicPath: '/'
    },
    // optimization: {
    //     splitChunks: {
    //         cacheGroups: {
    //             commons: {
    //                 name: "common",
    //                 filename: "common.js",
    //                 chunks: "initial",
    //                 minChunks: 2
    //             }
    //         }
    //     }
    // },
    module: { //我写一个module
        rules: [
            {
                test: /\.less$/,
                use: [{
                    loader: 'style-loader',
                }, {
                    loader: 'css-loader', // translates CSS into CommonJS
                }, {
                    loader: 'less-loader', // compiles Less to CSS
                    options: {
                        modifyVars: {
                            'font-family' : '"Microsoft YaHei", "Helvetica Neue", Helvetica Neue, Helvetica, Arial, sans-serif',
                            'primary-color': '#df5064',                        // 全局主色
                            'link-color': '#df5064',                            // 链接色
                            'success-color': '#52c41a',                        // 成功色
                            'warning-color': '#faad14',                       // 警告色
                            'error-color': '#f5222d',                          // 错误色
                            'font-size-base': '14px',                           // 主字号
                            'heading-color': 'rgba(0, 0, 0, .85)',             // 标题色
                            'text-color': 'rgba(0, 0, 0, .65)',                 // 主文本色
                            'text-color-secondary': 'rgba(0, 0, 0, .45)',     // 次文本色
                            'disabled-color': 'rgba(0, 0, 0, .25)',            // 失效色
                            'border-radius-base':'3px',                        // 组件/浮层圆角
                            'border-color-base': '#d9d9d9',                     // 边框色
                            'box-shadow-base': '0 2px 8px rgba(0, 0, 0, .15)'  // 浮层阴影
                        },
                        javascriptEnabled: true,
                    }
                }]
            },
            { // 这里用rules而不是loaders
                test: /\.jsx?$/, // 匹配所有js文件
                exclude: /node_modules/, // 排除掉node_modules这个文件夹的js文件
                loader: 'babel-loader'
            },
            {
                test:/(\.css|\.scss)/,
                use:['style-loader','css-loader','sass-loader'] // 编译顺序从右往左
            },
            {
                test:/\.(jpe?g|png|gif|svg|woff|eot|ttf)\??.*$/,
                use:[{
                    loader:'url-loader',
                    options:{ // 这里的options选项参数可以定义多大的图片转换为base64
                        limit:50000, // 表示小于50kb的图片转为base64,大于50kb的是路径
                        outputPath:'images' //定义输出的图片文件夹
                    }
                }]
            }, {
                test: /\.json$/,
                loader: 'json-loader'
            }
        ]
    }
};

module.exports = webpackConfig;